<template>
	<div>
		<el-breadcrumb separator-class="el-icon-arrow-right">
		  <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
		  <el-breadcrumb-item>权限管理</el-breadcrumb-item>
		  <el-breadcrumb-item>权限列表</el-breadcrumb-item>
		</el-breadcrumb>
		<el-card class="box-card">
		   <el-table
						border
						stripe
		        :data="RightsList"
		        style="width: 100%">
						<el-table-column
						  type="index"
						  label="#"
						  width="50">
						</el-table-column>
		        <el-table-column
		          prop="authName"
		          label="权限名称">
		        </el-table-column>
		        <el-table-column
		          prop="path"
		          label="路径">
		        </el-table-column>
		        <el-table-column
		          prop="level"
		          label="权限等级">
							<template slot-scope="scope">
								<el-tag v-if="scope.row.level==='0'" >一级权限</el-tag>
								<el-tag type="success" v-else-if="scope.row.level==='1'">二级权限</el-tag>
								<el-tag type="warning" v-else>三级权限</el-tag>
							</template>
		        </el-table-column>
		      </el-table>
		</el-card>
	</div>
</template>

<script>
	export default{
		created() {
			this.getRightsList()
		},
		methods:{
			async getRightsList(){
				var {data:res} = await this.$http.get('rights/list');
				if(res.meta.status!==200)return this.$message.error('获取用户权限列表失败！');
				this.RightsList = res.data
			}
		},
		data(){
			return{
				RightsList:[]
			}
		}
	}
</script>

<style>
	
</style>
